<template>
  <div id="app">
    <markdown-renderer :content="markdownContent" />
    <katex-renderer :formula="markdownContent" />
  </div>
</template>

<script>
import MarkdownRenderer from './components/MarkdownRenderer.vue';
import KatexRenderer from './components/KatexRenderer.vue';

export default {
  components: {
    MarkdownRenderer,
    KatexRenderer
  },
  data() {
    return {
      markdownContent: `

1.1 中心趋势度量： 
$$
\\text{均值} (\\bar{x}) = \\frac{1}{N}\\sum_{i=1}^{N} x_i
$$

$$
\\text{中位数} = \\begin{cases} 
x_{(n+1)/2}, & \\text{当 }n \\text{是奇数} \\\\ 
\\frac{x_{(n/2)} + x_{(n/2 + 1)}}{2}, & \\text{当 }n \\text{是偶数} 
\\end{cases}
$$

1.2 变异性度量：

$$
\\text{方差} (s^2) = \\frac{1}{N-1}\\sum_{i=1}^{N} (x_i - \\bar{x})^2
$$

$$
\\text{标准差} (s) = \\sqrt{s^2}
$$

1.3 分布形状指标： 

$$
\\text{偏度} = \\frac{1}{N}\\sum_{i=1}^{N} \\left(\\frac{x_i - \\bar{x}}{s}\\right)^3
$$

$$
\\text{峰度} = \\frac{1}{N}\\sum_{i=1}^{N} \\left(\\frac{x_i - \\bar{x}}{s}\\right)^4 - 3
$$

      `
    };
  }
};
</script>

<style>
#app {
  width: 60%;
  margin: 0 auto;
}
</style>
